import React from 'react';
import {Card, Table} from "antd";
import pathColumns from "columns/PathColumns";
import LogFactory from "log/LogFactory";
import {useAppDispatch, useAppSelector} from "../../../redux/hook";
import {PathState} from "../../../redux/reducer/pathReducer";
import {fetchPageData} from "../../../redux/reducer/pathReducer";
import TableToolbar from "common/table/TableToolbar";

const log = LogFactory.getLog("RoleListComponent") ;
const PathListComponent = () => {

    const dispatch = useAppDispatch() ;
    const pathState: PathState = useAppSelector(state => state.path) ;

    log.debug("path-redux-status: " , pathState.status) ;

    if (pathState.status === 0){
        dispatch(fetchPageData({current: 1, pageSize: pathState.pageSize})) ;
    }
    if (pathState.status === 4){
        dispatch(fetchPageData({current: pathState.current, pageSize: pathState.pageSize})) ;
    }

    const pageOnChange = (page: number, pageSize: number) => {
        dispatch(fetchPageData({current: page, pageSize: pageSize})) ;
    } ;

    return (
        <Card
            title={"路径列表"}
            extra={"其他操作"}
        >
            <TableToolbar titleContent={pathState.total}/>
            <Table
                loading={pathState.loading}
                columns={pathColumns}
                dataSource={pathState.data}
                pagination={{
                    total: pathState.total,
                    current: pathState.current,
                    pageSize: pathState.pageSize,
                    onChange: pageOnChange
                }}
            />
        </Card>
    );
};
export default PathListComponent;